<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
	<input type="hidden" name="id" value="${sessionScope.mvo.id }">
	<input type="hidden" name="membertype" value="${sessionScope.mvo.membertype}">
<c:choose>
<%-- 
	로그인이 되었을때 기본 적인 로직이 수행되고 
	로그인이 안되었을 때는 로그인을 수행하도록 페이지를 이동한다.
--%>
	<c:when test="${sessionScope.mvo!=null}">
<script type="text/javascript">
	$(document).ready(function(){
		
		//초기에 화면에 뿌려줄 내용
		//$("#total_gugunDiv").hide();
		$.ajax({
			type:"POST",
			url:"hopeSubjectList.do",
			dataType:"json",
			success:function(jsonData){	
				
					//시도 리스트 가져와서 뿌리기
				$("#userHoperegion option").remove();
				var op="<option value='false'>-----------------</option>";
				$("#userHoperegion").append(op);
 				$.each(jsonData.sidoList,function(index, sidoList){	//jsonData.sidoList을 sidolist란 이름으로 사용
 					op="<option value="+sidoList.code_code+">"+sidoList.code_name+"</option>";
					$("#userHoperegion").append(op); 
				});   
		
 				//희망과목 가져와서 뿌리기
				$("#userHopesubject option").remove();
				op="<option value='false'>-----------------</option>";
				$("#userHopesubject").append(op);
 				$.each(jsonData.hopeSubjectList,function(index,hopesubjectlist){
 					op="<option value="+hopesubjectlist.code_code+">"+hopesubjectlist.code_name+"</option>";
					$("#userHopesubject").append(op); 
				});
 					//성별 가져와서 뿌리기
				$("#radioGender input").remove();
				op="";
 				$.each(jsonData.genderList,function(index, genderlist){
 					op="<input type='radio' name='userGender' value="+genderlist.code_code+">"+genderlist.code_name+"</option>";
					$("#radioGender").append(op); 
				});
 				$("#radioHopegender input").remove();
				op="";
 				$.each(jsonData.genderList,function(index, genderlist){
 					op="<input type='radio' name='userHopegender' value="+genderlist.code_code+">"+genderlist.code_name+"</option>";
					$("#radioHopegender").append(op); 
				});
 	 				//학교학년 가져와서 뿌리기
				$("#userAvailablestudent option").remove();
				op="<option value='false'>------------------------</option>";
				$("#userAvailablestudent").append(op);
 				$.each(jsonData.gradeList,function(index, gradelist){
 					op="<option value="+gradelist.code_code+">"+gradelist.code_name+"</option>";
					$("#userAvailablestudent").append(op); 
				}); 
			
			}//success
		});//ajax
		
		$("#userHoperegion").change(function(){
			userSido=$(this).val();
			if(userSido=='false'){//시도 값이 바뀌었는데 --을 선택한 경우
				$("#userGugun").hide();
			}else{						
				$("#userGugun").show();				
			}
			$.ajax({
				type:"POST",
				url:"gugunList.do",
				data:"code_code="+userSido,
				dataType:"json",
				success:function(jsonData){
	 				//구군정보 가져와서 뿌리기
					$("#userGugun option").remove();
					var op="<option value='false'>--</option>";
					$("#userGugun").append(op);
	 				$.each(jsonData,function(index, codemaster){
	 					op="<option value="+codemaster.code_code+">"+codemaster.code_name+"</option>";
						$("#userGugun").append(op); 
					});
				}
			});
		});
		
		$(".updateVal").click(function(){
			$(this).val("");
		});
		$(".edit").click(function(){
			$(this).next().next().toggle();// div .input
			$("#gugun").hide();
			
			$(".input").each(function(i){
				$(".form")[i].reset();
			});
			
			if($("#userHoperegion").val()=='false'){//수정버튼을 눌러 폼이 등장할때 --을 선택한 경우
				$("#userGugun").hide();
			}
			//$(".form")[1].reset();// form의 입력정보를 리셋
		});
		$(".cancelButton").click(function(){
			$(this).parent().parent().parent().toggle();// div .input
		});
		$(".saveButton").click(function(){
			
			var inputMember =$(this);
			var dataString ="id="+$("input[name=id]").val()+"&membertype="+$("input[name=membertype]").val();
			var urlData ="";
			// label의 text값에 따라 넘겨지는 값이 다르도록 코드를 생성
			if($(this).parent().parent().parent().prev().prev().prev().text()=="이름"){
				dataString+="&name="+$("#userName").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.name);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="성별"){
				dataString+="&gender="+$("input[name=userGender]:checked").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.gender);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="전화번호"){
				dataString+="&tel="+$("#userTel").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.tel);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="이메일 주소"){
				dataString+="&email="+$("#userEmail").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.email);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="희망 지역"){
				dataString+="&hoperegion="+$("#userGugun").val();
				urlData="updateMember.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.hoperegion);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="소개"){
				dataString+="&intro="+$("#userIntro").val();
				urlData="updateTeacher.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.intro);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="대학교"){
				dataString+="&university="+$("#userUniversity").val();
				urlData="updateTeacher.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.university);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="희망 학생성별"){
				dataString+="&hopegender="+$("input[name=userHopegender]:checked").val();
				urlData="updateTeacher.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.hopegender);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="희망 과목"){
				//alert($("#userHopesubject").val());
				dataString+="&hopesubject="+$("#userHopesubject").val();
				urlData="updateTeacher.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.hopesubject);
					}
				});//ajax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="수업 가능한 시간"){
				var userAvailableday =$("input:checkbox[name=userAvailableday]:checked");
				//alert($("input[name=userAvailableday]:checked").val());
				if(userAvailableday.length>0){ // dataString setting
				 	dataString +="&availableday=";
					for(var i=0; i<userAvailableday.length; i++){
						dataString+=$(userAvailableday[i]).val();// val() 함수를 쓰는 방법 유의
					}
				}
				dataString+="&availabletime="+$("#userAvailabletime1").val()+$("#userAvailabletime2").val();
				//alert(dataString);
				urlData="updateTeacher.do";
				$.ajax({
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						//alert(inputMember.parent().parent().parent().hide().prev().child());
						inputMember.parent().parent().parent().hide().prev().html(
								"<div class='profileInfo'>"+jsonData.availableday+"</div>"+
								 "<div class='profileInfo'>"+jsonData.availabletime+"</div>"
								);
					}
				});//a	jax
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="수업 가능한 학생"){
				dataString+="&availablestudent="+$("#userAvailablestudent").val();
				urlData="updateTeacher.do";
				$.ajax({		
					type:"post",
					url:urlData,
					dataType:"json",
					data:dataString,
					success:function(jsonData){
						inputMember.parent().parent().parent().hide().prev().text(jsonData.availablestudent);
					}
				});
			}else if($(this).parent().parent().parent().prev().prev().prev().text()=="사진"){
				 dataString+="&uploadfile="+$("input[name=userUploadfile]").val();
				 urlData="updatePicture.do";
				 //alert(dataString)
					alert($("#pictureForm").serialize()+"&uploadfile="+$("input[name=userUploadfile]").val());
				 $.ajax({
					type:"post",
					url:urlData,
					//"multipart/form-data; charset=UTF-8",
					dataType:"json",
					data:$("#pictureForm").serialize()+"&uploadfile="+$("input[name=userUploadfile]").val(),
					success:function(jsonData){
						 /* inputMember.parent().parent().parent().hide().prev().html("<img alt='프로필 사진'"+ 
					     	+"src='${initparam.root}img/'"+jsonData.hopesubject+".jpg'>");  */
					} //success
				});   
			}//if  
		});
		$(".item").hover(
				function() {
					$(this).toggleClass("on");
				}
		);
		$(".input").hide();
		
	});
	
</script>   
    

<div id="profile_container">
	<div id="picture" class="item">
	 <div class="label">사진</div><div class="edit">수정</div>
     <div class="profileInfo">
     	<c:if test="${requestScope.mvo.savefilename}!=''">
     	<img alt="프로필 사진" 
     	src="${initparam.root}img/${requestScope.mvo.savefilename}.jpg">
     	</c:if>
     </div>
     <div id="inputPicture" class="input">
		<form class="form" method="post" enctype="multipart/form-data" id="pictureForm">
		 	<input type="hidden" name="id" value="${sessionScope.mvo.id }">
			<input type="hidden" name="membertype" value="${sessionScope.mvo.membertype}">
		 	<input type="file" name="userUploadfile" >
		 	<div class="inputButton">
				<input class="saveButton" type="button" value="저장">
		 		<input class="cancelButton" type="button" value="취소">
		 	</div>
		</form>
	 </div>
	</div>
	<div id="basic">
		<div id="intro" class="item">
		<div class="label" >소개</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.intro }</div>
		 	<div id="inputIntro" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userIntro" value="정보를 입력하세요.">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="name" class="item">
		<div class="label">이름</div><div class="edit">수정</div>
		<div class="profileInfo">${requestScope.mvo.name }</div>
		 	<div id="inputName" class="input">
		 		<form class="form">
			 			<input class="updateVal" type="text" id="userName" value="이름은 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="gender" class="item">
		<div class="label">성별</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.gender }</div>
		 	<div id="inputGender" class="input">
		 		<form class="form">
				 		<span id="radioGender"></span>
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="tel" class="item">
		<div class="label">전화번호</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.tel }</div>
		 	<div id="inputTel" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userTel" value="전화번호는 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="email" class="item">
		<div class="label">이메일 주소</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.email }</div>
		 	<div id="inputEmail" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userEmail" value="이메일은 무엇인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
		<div id="university" class="item">
		<div class="label">대학교</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.university }</div>
		 	<div id="inputUniversity" class="input">
		 		<form class="form">
				 		<input class="updateVal" type="text" id="userUniversity" value="출신 대학교는 어디인가요?">
			 		<div class="inputButton">
				 		<input class="saveButton" type="button" value="저장">
				 		<input class="cancelButton" type="button" value="취소">
				 	</div>
				</form>
		 	</div>
		</div>
	</div>
	
	<div id="append">
		<div id="hoperegion" class="item">
		<div class="label">희망 지역</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.hoperegion }</div>
		 	<div id="inputHoperegion" class="input">
			 	<form class="form">
			 		<select id = "userHoperegion">
						<option>----</option>
					</select>	
					<select id = "userGugun">
						<option>----</option>
					</select>
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="hopesubject" class="item">
		<div class="label">희망 과목</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.hopesubject }</div>
		 	<div id="inputHopeSubject" class="input">
			 	<form class="form">
			 		<select id = "userHopesubject">
						<option value = "">--</option>
					</select>	
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="hopegender" class="item">
		<div class="label">희망 학생성별</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.hopegender }</div>
		 	<div id="inputHopeGender" class="input">
			 	<form class="form">
			 		<span id="radioHopegender"></span>
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="availablestudent" class="item">
		<div class="label">수업 가능한 학생</div><div class="edit">수정</div>
		 <div class="profileInfo">${requestScope.mvo.availablestudent }</div>
		 	<div id="inputAvailablestudent" class="input">
			 	<form class="form">
			 		<select id = "userAvailablestudent">
						<option>----</option>
					</select>	
				 	<div class="inputButton">
					 	<input class="saveButton" type="button" value="저장">
					 	<input class="cancelButton" type="button" value="취소">
					</div>
				</form>
			</div>
		</div>
		<div id="updateAvailabledaytime" class="item">
			 <div class="label">수업 가능한 시간</div><div class="edit">수정</div>
			 <div>
				 <div class="profileInfo">${requestScope.mvo.availableday }</div>
				 <div class="profileInfo">${requestScope.mvo.availabletime }</div>
			 </div>
			 	<div id="inputAvailabledaytimr" class="input">
			 		<form class="form">
			 			<p>수업 날짜</p>
				 		    <input type="checkbox" name="userAvailableday" value="무관" ></input><label>무관</label>
							<input type="checkbox" name="userAvailableday" value="월" ></input><label>월</label>
							<input type="checkbox" name="userAvailableday" value="화" ></input><label>화</label>
							<input type="checkbox" name="userAvailableday" value="수" ></input><label>수</label>
							<input type="checkbox" name="userAvailableday" value="목" ></input><label>목</label>
							<input type="checkbox" name="userAvailableday" value="금" ></input><label>금</label>
							<input type="checkbox" name="userAvailableday" value="토" ></input><label>토</label>
							<input type="checkbox" name="userAvailableday" value="일" ></input><label>일</label>
						<p>수업 시간</p>
				 		    <input class="updateVal" type="text" id="userAvailabletime1" value="시작시간이 언제인가요?">
				 		   ~  <input class="updateVal" type="text" id="userAvailabletime2" value="종료시간이 언제인가요?">
				 		   ex) pm:03 -> 15로 입력
					 	<div class="inputButton">
						 	<input class="saveButton" type="button" value="저장">
						 	<input class="cancelButton" type="button" value="취소">
						</div>
					</form>
				</div>
		</div>
	</div><!-- append -->
</div>
</c:when>
	<c:otherwise>
		<c:choose>
			<c:when test="sessonScope.mvo.membertype==t">
				<script type="text/javascript">
					var path ="profile/profileTeacher.mypage";
					location.href="loginResult.do?path="+path;
				</script>
			</c:when>
			<c:otherwise>
				<script type="text/javascript">
					var path ="profile/profileStudent.mypage";
					location.href="loginResult.do?path="+path;
				</script>
			</c:otherwise>
		</c:choose>
	</c:otherwise>
</c:choose>